<div class="thumbnail">
  <img src="http://placehold.it/820x230" alt="">
  <div>
    <h4 class="pull-right">{{product?.price}}元</h4>
    <h4>{{product?.Title}}</h4>
    <p>{{product?.desc}}</p>
  </div>
  <p class="pull-right">{{comments?.length}}</p>
  <p>
    <app-stars [rating] = "product?.rating"></app-stars>
  </p>
</div>
<div class="well">
  <div><button class="btn btn-success" (click)="isCommentHidden=!isCommentHidden">发表评论</button></div>
  <div [hidden]="isCommentHidden">
    <div>
      <!--():需要发射事件才能更改目标值 []:属性绑定<单向>-->
      <app-stars [(rating)]="newRating" [readonly]="false"></app-stars>
    </div>
    <div><textarea [(ngModel)]="newComment"></textarea></div>
    <div><button class="btn" (click)="addComment()">添加</button></div>
  </div>

  <div class="row" *ngFor = "let comment of comments">
    <hr>
    <div class="col-md-12">
      <app-stars [rating]="comment.rating"></app-stars>
      <span>{{comment.user}}</span>
      <span>{{comment.timestamp}}</span>
      <p></p>
      <p>{{comment.content}}</p>
    </div>

  </div>
</div>
